<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="../js/vue.js"></script>
</head>
<body>

<div id="div1">

    <a v-bind:href="url">Vue的官网</a>
    <a :href="url">Vue的官网</a>        <!--两种方式都能绑定url-->
    <button @click="handle">修改url</button>

</div>

<script>

    const vueObj = new Vue({
        el:'#div1',
        data: {
            url: 'https://cn.vuejs.org/api/built-in-directives.html#v-bind',


        },
        methods:{
            handle:function(){
                //点击按钮修改绑定的url
                this.url = "https://www.baidu.com/";   //只能修改一次，之后url变回之前的
            },

        }
    });
</script>
</body>
</html>